<template>
    <div>
         <div class="ExpectedPosition">
            <h2><span>|</span>实习经历</h2>
            <div class="hrhr"></div>
            <ul>
                <li v-for="(i,index) in PPracticejob" :key="index">
                    <!-- 点击查看个人实习经历内容 -->
                    <div v-show="prt" class="seePracticejob">
                        <i class="el-icon-close close" @click="closePracticejob()"></i>
                         <div style="width:90%; padding:0 5%;">
                            <!-- 实习经历 -->
                            <h1 class="name">实习经历</h1>
                            <el-form ref="form" :model="form" label-width="80px">
                                <el-row>
                                <el-col :span="12">
                                        <el-form-item label="公司名称" style="width:98%;">
                                        <el-input v-model="form.companyname" placeholder="请输入公司名称" :disabled="disabled"></el-input>
                                        </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="所属行业" style="width:98%;">
                                        <el-input v-model="form.industry" placeholder="请输入所属行业" :disabled="disabled" ></el-input>
                                    </el-form-item>
                                </el-col>
                                </el-row>
                                <el-row>
                                <el-col :span="12">
                                    <el-form-item label="所属部门" style="width:98%;">
                                        <el-input v-model="form.department" placeholder="请输入所属部门" :disabled="disabled"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="职位名称" style="width:98%;">
                                        <el-input v-model="form.jobname" placeholder="请输入职位名称" :disabled="disabled"></el-input>
                                    </el-form-item>
                                </el-col>
                                </el-row>

                                <el-row>
                                <el-col :span="12">
                                    <el-form-item label="职位类型" style="width:98%;">
                                        <el-input v-model="form.jobtype" placeholder="请输入职位类型" :disabled="disabled"></el-input>
                                    </el-form-item>   
                                </el-col>
                                <el-col :span="12">
                                    <el-form-item label="拥有技能" style="width:98%;">
                                        <el-input v-model="form.skills" placeholder="请输入拥有技能" :disabled="disabled"></el-input>
                                    </el-form-item>  
                                </el-col>
                                </el-row>

                                <el-form-item label="在职时间" style="width:99%">
                                    <el-col :span="11">
                                    <el-date-picker type="date" placeholder="开始时间" v-model="form.date1" style="width: 100%;" :disabled="disabled"></el-date-picker>
                                    </el-col>
                                    <el-col class="line" :span="2">-</el-col>
                                <el-col :span="11">
                                    <el-date-picker type="date" placeholder="结束时间" v-model="form.date2" style="width: 100%;" :disabled="disabled"></el-date-picker>
                                    </el-col>
                                </el-form-item>
                                
                                <el-form-item label="工作内容" style="width:99%">
                                    <el-input type="textarea" v-model="form.workcontent" rows="2px" :disabled="disabled"></el-input>
                                </el-form-item>

                                <el-form-item> 
                                    <el-button icon="el-icon-delete" circle class="delete" @click="deleteForm()"></el-button>
                                    <el-button @click="updateForm()" class="chongzhi">修改</el-button>
                                    <el-button type="primary" @click="updateptjob()" class="button">保存</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                    </div>
                    <i class="cc" @click="openPracticejob(i)">{{i.companyname}}</i>
                    <!-- <label class="bb">|</label> -->
               </li>
            </ul>
            <i class="el-icon-edit-outline edit" @click="editPracticejob()">添加</i>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return{
            form: {
            companyname: '',
            department:'',
            industry: '',
            jobname:'',
            date1: '',
            date2: '',
            jobtype: '',
            skills:'',
            workcontent: '',
            id:''
        },
        }
    }
}
</script>

<style lang="less" scoped>
.ExpectedPosition{
    box-shadow: 10px 10px 5px #888888;
    width: 100%;
    // height: 200px;
    background-color: antiquewhite;
    margin-bottom: 10px;
    span{
        margin:0 10px;
        color: #3db3b7;
        font-size: 25px;
        font-weight: 800;
    }
    h2{
        margin: 0;
        color: rgb(61, 60, 60);
        font-weight: 400;
    }
    li{
        // float: left;
        display: inline-block;
        list-style: none;
        margin-right: 50px;
        cursor: pointer;
    }
    .bb{
        margin-left: 50px;
        color: #949494;
    }
    .cc{
        color: #494949;
        cursor: pointer;
    }
    .seePracticejob,.seePerProjectexp{
        // width: 36%;
        // height: 250px;
        background-color: #fff;
        position: absolute;
        top: 60px;
        left: 40%;
        .close{
            position:absolute;
            top: 20px;
            right: 20px;
            font-size: 24px;
        }
        .name{
            color: #353535;
            font-size: 23px;
            margin: 5px 10px;
        }    
        .button{
            margin-left: 163px;
            float: right;
            background-image: linear-gradient(#7a7878, #5a5a5a);
            border: none;
        }
        .chongzhi{
            float: left;
            margin-left: -75px;
        }
        .back{
            font-size: 20px;
            margin-right: 55px;
            width: 30px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            font-weight: 600;
            border-radius: 50%;
            margin-right: 30px;
        }

    }
}
</style>